<template>
	<div class="list-wrapper">
		<table class="list-table" border="0" cellspacing="0" cellpadding="0">
		 	<thead>
        <tr>
          <th></th>
          <th>客户名称</th>          
          <th>联系人</th>
          <th>联系电话</th>
          <th>报班课程</th>
          <th>开班日期</th>
          <th>报班人次</th>
          <th>备注</th>          
        </tr>
      </thead>
      <tbody>
        <tr v-for="item in list">
					<td>
						<img src="../../img/edit.gif" alt="" @click="edit(item.id)">
            <img src="../../img/del.png" alt="" @click="del(item.id)">
					</td>
          <td>{{item.customer}}</td>
					<td v-if="item.customer">{{item.fcontact}}</td>
          <td v-else>{{item.name}}</td>          
					<td v-if="item.customer">{{item.ftel}}</td>
					<td v-else>{{item.tel}}</td>
					<td>{{item.course}}</td>
					<td>{{item.startdate}}</td>
					<td>{{item.num}}</td>
          <td>{{item.remark}}</td>
				</tr>
      </tbody>
		</table>
		<el-dialog title="" :visible.sync="dialogFormVisible" size="tiny">
			<el-form :model="form">
				<el-form-item label="备注" label-width="50px">
					<el-input type="textarea" :rows="5" v-model="form.remark"></el-input>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogFormVisible = false">取 消</el-button>
				<el-button type="primary" @click="sub">确 定</el-button>
			</div>
		</el-dialog>
		<el-pagination @current-change="handleCurrentChange" :current-page="page" :page-size="10" layout="total, prev, pager, next, jumper" :total="total"></el-pagination>
		
	</div>
</template>

<script>
export default {
  data() {
    return {
      page: 1,
      total: 0,
      list: [],
      dialogFormVisible: false,
      form: {
        remark: ""
      },
      id: ""
    };
  },

  created() {
    this.getList();
  },

  methods: {
    handleCurrentChange(val) {
      this.page = val;
      this.getList();
    },
    getList() {
      let data = {
        page: this.page
      };
      this.apiPost("customer/customerApply", data).then(res => {
        this.list = res.list;
        this.total = res.total;
      });
    },
    edit(id) {
      let data = {
        id: id
      };
      this.apiPost("customer/customerApplyDetail", data).then(res => {
        this.form.remark = res.remark;
        this.id = res.id;
        this.dialogFormVisible = true;
      });
    },
    del(id) {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let data = {
            id: id
          };
          this.apiPost("customer/customerApplyDelete", data).then(res => {
            let remind = res.error ? "error" : "success";
            _g.toastMsg(remind, res.msg);
            if (!res.error) {
              this.getList();
            }
          });
        })
    },
    sub() {
      this.dialogFormVisible = false;
      let data = {
        id: this.id,
        remark: this.form.remark
      };
      this.apiPost("customer/customerApplyEdit", data).then(res => {
        if (!res.error) {
          _g.toastMsg("success", res.msg);
          this.getList();
        } else {
          _g.toastMsg("success", res.msg);
        }
      });
    }
  }
};
</script>

<style scoped>

</style>